var app = new Vue({
  el: '#app',
  data () {
    return {
      dialogShow: false, // 弹框显示
      otherMarket: false, // 弹框其它超市显示 
      cartShow: false, // 弹框购物车显示
      searchValue: '', // 搜索框关键字
      goodslist: null, // 商品列表数据
      marketlist: null, // 其它超市数据
      spreadRate: '', // 价差率
      num: 1, // 购物车弹框商品数量
      curIndex: 0, // 当前下标
      errMsg: '', // Toast提示框提示文字
      name: '', // 其它超市商品名
      currentPage: 0, // 当前页数
      totalPage: 2, //总页数
      pageSize: 8,
      loading: false
    }
  },
  watch: {
    // Toast提示框1秒后消失
    errMsg: function (newerrMsg, olderrMsg) {
      setTimeout(function() { 
        app.errMsg = ''    
      }, 1000);
    }
  },
  methods: {
    // 返回
    goback () {
      window.history.go(-1);
    },
    // 搜索按钮
    submit () {
      this.loading = true
      this.currentPage = 1
      this.goodslist = null
      this.searchData()      
    },
    loadMore(){// 滚动加载更多商品
      this.currentPage ++
      if(this.currentPage > this.totalPage){
        this.loading = true        
        return false
      }
      this.searchData()
    },
    // 获取商品数据
    searchData () {
      let id = Number(getUrlParam("id"))
      Axios.post('/goods/goods/searchgoodsList.do', {
        fullName: this.searchValue,
        categoryId: id,
        currentPage: this.currentPage
      }).then(res => {
        if (res.respCode === "S") {
          let list = res.data.data
          list.forEach(goods => {
            goods.minPrice = goods.minPrice / 100           
          });
          if (this.currentPage == 1) {
            this.goodslist = list
          } else {
            this.goodslist = this.goodslist.concat(list)
          }
          this.totalPage = res.data.totalPage
          this.currentPage = res.data.currentPage

          if (this.currentPage < this.totalPage) {
            this.loading = false
          }
          this.$nextTick(() => {
            let h3 = document.querySelector('.list').querySelectorAll('h3')
            let p = document.querySelector('.list').querySelectorAll('p')             
            if (this.currentPage == 1) {
              var i = 0
            } else {
              i = (this.currentPage - 1) * this.pageSize
            }
            for (let j = i; j < h3.length; j++) {
              if (h3[j].getBoundingClientRect().height > 21) {
                p[j].style.bottom = "10vw" 
              }
            }
          })          
        } else {
          this.goodslist = []
        }       			
      }).catch(err => {
        console.error(err)
      })
    },
    isEllipsis (content, contentWidth) {
      let el = document.createElement('div')  // 创建一个临时div
      el.innerHTML = content
      el.style.whiteSpace = 'nowrap' // 不换行
      el.style.position = 'absolute'
      el.style.opacity = 0 // 完全透明
      document.body.appendChild(el)
      const elWidth = el.clientWidth  // 获取这个含有content内容的临时div的宽度
      document.body.removeChild(el)
      return elWidth > contentWidth   // 判断这个临时div的宽度是否大于原节点宽度的两倍
    },
    // 其它超市按钮
    otherPrice (index) {
      this.name = this.goodslist[index].fullName
      Axios.post('/goods/goods/supermarketPriceList.do', {
        goodsSkuId: this.goodslist[index].goodsSkuId
      }).then(res => {
        let list = res.data.supermarketGoodsList
        list.forEach(goods => {
          if (goods.price == -1) {
            goods.price = "暂无价格"
          } else {
            goods.price = goods.price / 100 + "元"
          }          
        });
        this.spreadRate = res.data.spreadRate        
        this.marketlist = list
        this.dialogShow = true
        this.otherMarket = true
			}).catch(err => {
        console.error(err)
      })
    },
    // 加入购物车按钮
    cartdialogShow (index) {
      this.dialogShow = true
      this.cartShow = true
      this.curIndex = index
    },
    // 取消按钮
    btnCancel () {
      this.dialogShow = false
      this.otherMarket = false
      this.cartShow = false
    },
    // 加号按钮
    btnPlus () {
      if (this.num < 99) {
        this.num = this.num + 1
      }
    },
    btnReduce () { // 减号按钮
      if (this.num > 1) {
        this.num = this.num - 1
      }
    },
    // 加入购物车确定按钮
    btnOk () {
      Axios.post('/goods/shopCar/addShopCar.do', {
        goodsSkuId: this.goodslist[this.curIndex].goodsSkuId,
        quantity: this.num
      }).then(res => {        
        this.errMsg = "您已提交成功<br/>请到购物车查看"
      }).catch(err => {
        console.error(err)
      })
      this.dialogShow = false
      this.cartShow = false
      this.num = 1
    }
  }
})